<template>
  <div class="training-container">
    <h2>人才培养</h2>
    <div class="training-content">
      <div class="section">
        <h3>培训体系</h3>
        <p>中空领航建立了完善的培训体系，包括新员工入职培训、专业技能培训、管理能力培训和领导力发展项目等多个维度，全方位提升员工综合素质和专业能力。</p>
        <div class="training-img">
          <img src="http://www.sutpc.com/static/images/training.jpg" alt="培训体系" />
        </div>
      </div>
      
      <div class="section">
        <h3>职业发展</h3>
        <p>公司为员工提供清晰的职业发展通道，包括管理序列和专业技术序列双通道发展路径，满足不同员工的职业发展需求。我们鼓励员工在实践中成长，提供轮岗和跨部门交流机会，拓宽员工的职业视野。</p>
        <div class="career-path">
          <div class="path-item">
            <div class="path-title">管理序列</div>
            <div class="path-content">
              <p>总经理 → 副总经理 → 部门经理 → 主管 → 组长</p>
            </div>
          </div>
          <div class="path-item">
            <div class="path-title">专业技术序列</div>
            <div class="path-content">
              <p>首席专家 → 高级专家 → 资深工程师 → 高级工程师 → 工程师 → 助理工程师</p>
            </div>
          </div>
        </div>
      </div>
      
      <div class="section">
        <h3>创新人才计划</h3>
        <p>中空领航设立了"未来之星"人才培养计划，为优秀年轻员工提供快速成长通道。通过导师制、重点项目历练和专项培训，加速培养创新型人才，满足公司发展的人才需求。</p>
        <ul class="program-list">
          <li>优秀毕业生培养计划</li>
          <li>中层管理人才培养计划</li>
          <li>核心技术人才培养计划</li>
          <li>国际化人才培养计划</li>
        </ul>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'Training'
}
</script>

<style scoped>
.training-container {
  padding: 20px 0;
}

.training-container h2 {
  font-size: 28px;
  color: #333;
  border-bottom: 2px solid #0066cc;
  padding-bottom: 10px;
  margin-bottom: 25px;
}

.section {
  margin-bottom: 30px;
}

.section h3 {
  font-size: 22px;
  color: #0066cc;
  margin-bottom: 15px;
}

.section p {
  font-size: 16px;
  line-height: 1.8;
  color: #555;
  margin-bottom: 15px;
}

.training-img {
  margin: 20px 0;
  text-align: center;
}

.training-img img {
  max-width: 100%;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.career-path {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin: 20px 0;
}

.path-item {
  flex: 1;
  min-width: 300px;
  background: #f5f9ff;
  padding: 20px;
  border-radius: 5px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.path-title {
  font-size: 18px;
  font-weight: bold;
  color: #0066cc;
  padding-bottom: 10px;
  border-bottom: 1px solid #ddd;
  margin-bottom: 10px;
}

.path-content p {
  margin: 10px 0;
}

.program-list {
  list-style-type: disc;
  padding-left: 20px;
  margin: 15px 0;
}

.program-list li {
  font-size: 16px;
  line-height: 1.8;
  color: #555;
  margin-bottom: 10px;
}
</style> 